<template>
    <a-modal
        :bodyStyle="{maxHeight: maxHeight+'px', overflow: 'auto' }"
        :destroyOnClose="true"
        :title="title"
        :width="width"
        :visible="visible"
        :maskClosable="maskClosable"
        @ok="ok"
        @cancel="cancel"
        cancelText="关闭"
        :ok-button-props="{ props: { shape:'round'} }"
        :cancel-button-props="{ props: { shape:'round'} }">

        <div class="table-page-search-wrapper">
            <LForm v-if="formAttributes" ref="commitForm" @changeEventHandler="emitEventHandler" :formAttributes="formAttributes" :mostColumns="mostColumns" :labelCol="labelCol" :wrapperCol="wrapperCol"></LForm>
        </div>
    </a-modal>
</template>

<script>
import LForm from '@/components/lt/form/LForm'
import pick from 'lodash.pick'
import request from '@/utils/flowRequest'

export default {
    name: 'commitModal',
    components: { LForm },
    props: {
        title: {
            String,
            default: '流程提交'
        },
        width:{
            type:Number,
            default:600
        },
        maxHeight:{
            type:Number,
            default:800
        },
        maskClosable:{
            type:Boolean,
            default:true
        },
    },
    data() {
        return {
            mostColumns: 1,
            labelCol: {sm: { span: 6 }},
            wrapperCol: {sm: { span: 18 }},
            visible: false,
            formAttributes: {
                type:'',
                formItems: [
                    {
                        title:'',
                        columns:1,
                        fields: [
                            {field:'name',label:'当前环节',component:'input', disabled:true},
                            {field:'link',label:'下一环节',component:'select',hide:true,options:[],rules:[{required:true,message:'请选择下一环节!'}]},
                            {field:'isPass',label:'是否通过',component:'select',hide:false,disabled:true,rules:[{required:true,message:'请选择是否使用!'}],dictCode:'4kK2wMjqqq',initialValue:'1'},
                            {field:'approver',label:'审批人',component:'select',hide:true,rules: [{required: true, message: '审批人不能为空'}]},
                            {field:'approvalOpinion',label:'审批意见',component:'textarea',hide: true},
                        ]
                    }
                    
                ]
            },
            description:null,//环节说明
            formData:null,
        }
    },
    methods: {
        //解析每个环节的描述信息
        parseDescription(taskInfo){
            if(taskInfo.description){
                this.description = JSON.parse(taskInfo.description)
                //是否可以改变是否通过选择
                if(this.description["isPass"]){
                    this.isCanChangeIsPass()
                }
                //是否显示审批意见
                if(this.description["approvalOpinion"]){
                    this.showApprovalOpinion()
                }

                //如果要显示有审批人
                this.showApprover()
           

                //如果要人为选择下步环节
                if(this.description["link"]){
                    this.link = this.description["link"]
                    this.getNextFlowNode(taskInfo.id);
                }

            }
        },
        //是否可以改变是否通过选择
        isCanChangeIsPass(){
            this.formAttributes.formItems[0].fields[2].disabled = false
        },
        //是否显示审批意见
        showApprovalOpinion(){
            this.formAttributes.formItems[0].fields[4].hide = false
        },
       
        //判断下一环节是否为结束
        isEnd(isEndStr){
            let isEnd = false
            let argsArr =isEndStr['args'];
            argsArr = argsArr.replace('[', "").replace(']', "").split(",")
            const isEndFun = new Function(isEndStr['args'], isEndStr['body']);
            let argsVal = []
            for(let i=0;i<argsArr.length;i++){
                argsVal.push(this.formData[argsArr[i]])
            }
            isEnd = isEndFun(argsVal)
            return isEnd
            
        },
         //显示审批人,并根据环节属性，设置审批人
        showApprover(){
            if(this.description["approver"] && (!this.description["isEnd"] || !this.isEnd(this.description["isEnd"]))){
                this.formAttributes.formItems[0].fields[3].dictCode = this.description["approver"]
                this.formAttributes.formItems[0].fields[3].hide = false
            }
            
            
        },
         //隐藏审批人,并根据环节属性，设置审批人
        hideApprover(){
            this.formAttributes.formItems[0].fields[3].hide = true
        },
        //根据环节ID显示审批人
        showApproverByLinkId(dictCode){
            this.formAttributes.formItems[0].fields[3].dictCode = dictCode
            this.formAttributes.formItems[0].fields[3].hide = false
        },
        showLink(){
            if(this.description["link"]){
                this.formAttributes.formItems[0].fields[1].hide = false
            }
            
        },
        hideLink(){
            this.formAttributes.formItems[0].fields[1].hide = true
        },
        getNextFlowNode(taskId){
            request.get('/WorkflowController/getNextFlowNode',{params:{taskId:taskId}}).then((res)=>{
                if (res.success) {
                    let nextNodes = []
                    if(this.description["link"] && this.description["link"]["linkId"]){
                        nextNodes = res.result.filter(item => {
                           if(item["itemValue"] && item["itemText"]){
                                return this.description["link"]["linkId"].includes(item["itemValue"])
                            }else{
                               return false
                            }
                        })
                    }
                    if(nextNodes.length==1){
                        this.formAttributes.formItems[0].fields[1]["initialValue"]=nextNodes[0]["itemValue"]
                    }
                    this.formAttributes.formItems[0].fields[1]["options"] = nextNodes
                    this.formAttributes.formItems[0].fields[1].hide = false
                } else {
                    that.$message.warning(res.message);
                }
            })
        },
        open(data,formData) {
            this.formData = formData
            this.visible = true
            if (data) {
                this.parseDescription(data)
                this.$nextTick(() => {
                    this.$refs['commitForm'].getForm().setFieldsValue(pick(data, 'name'))
                })
            }
        },
        
        ok() {
            this.$refs.commitForm.getForm().validateFields((err, values) => {
                if (!err) {
                    this.visible = false
                    this.$emit('handleOk', this.$refs['commitForm'].getForm().getFieldsValue())
                }
                
            })
           
            
        },
        cancel() {
            this.visible = false
        },
        emitEventHandler(changeItem){
            if(changeItem["isPass"]){
                this.changeIsPass(changeItem["isPass"])
            }else if(changeItem["link"]){
                this.changeLink(changeItem["link"])
            }
            this.$emit('handlerChange',changeItem);
        },
        //是否通过值改变
        changeIsPass(isPass){
            if(isPass=="0"){
                this.hideLink()
                this.hideApprover()
            }else{
                this.showLink()
                this.showApprover()
            }
        },
        //下一环节值改变  FLOWEND表示结束环节
        changeLink(linkId){
            if(linkId=="FLOWEND"){
                this.hideApprover()
            }else{
                //审批人
                if(this.link["approver"]){
                    this.showApproverByLinkId(this.link["approver"][linkId])
                } 
            }
        }
    }
}
</script>

